<template>
  <div class="side-bar">
    <div class="logo"></div>
    <Menu theme="dark" :active-name="activeName" class="side-bar-menu" width="200">
      <MenuItem name="task" to="/dashboard/task">
        <Icon type="md-options" />
        <span>任务队列</span>
      </MenuItem>
      <MenuItem name="history" to="/dashboard/history">
        <Icon type="md-attach" />
        <span>推送历史</span>
      </MenuItem>
      <MenuItem name="logs" to="/dashboard/logs">
        <Icon type="logo-apple" />
        <span>运行日志</span>
      </MenuItem>
    </Menu>
  </div>
</template>
<script>
export default {
  name: 'sidebar',
  data () {
    return {
      activeName: 'history'
    }
  },
  mounted () {
    this.activeName = this.$route.name
  }
}
</script>

<style scoped>
.side-bar {
  & .logo {
    height: 64px;
  }
  & .side-bar-menu {
    width: 200px!important;
  }
}
</style>

